<template>
  <div>
    <div class="carbonEmissionAccount">
      <!-- 标题 -->
      <div class="carbonEmissionAccount-title">碳排放核算</div>


      <!-- 条件筛选 -->
      <div class="carbonEmissionAccount-condition">
        <div class="carbonEmissionAccount-condition-form">
          <normal-form-plus
            :formModel="formModel"
            :config="config"
            :plus="plus"/>
        </div>
        <div class="carbonEmissionAccount-condition-btn">
          <el-button @click="getAccountingByPage()">查询</el-button>
          <el-button @click="reset()">重置</el-button>
          <el-button @click="add()">新增</el-button>
        </div>
      </div>


      <!-- 表格-核算报告 -->
      <div class="carbonEmissionAccount-report">
        <normal-table
          :tableData="tableData"
          :paginationConfig="paginationConfig"
          :tableLabel="tableLabel"
          :operationConfig="operationConfig"
          :operationList="operationList"
          @event="handleEvent"
          @changePage="changePage"></normal-table>
      </div>


      <!-- 添加核算报告 -->
      <el-dialog
        title="添加核算"
        :visible.sync="showWindow"
        width="30%"
        class="form">
        <!-- form表单 -->
        <div class="formData">
          <normal-form
            :formModel="addFormModel"
            :config="addConfig"
            :plus="plus"/>
        </div>
        <span slot="footer" class="form-footer">
            <el-button type="primary" @click="createAccount()" class="confirm">确 定</el-button>
            <el-button @click="reset()">取 消</el-button>
          </span>
      </el-dialog>

    </div>
  </div>
</template>

<script>
import NormalTable from '@/components/NormalTable'
import NormalFormPlus from '@/components/NormalFormPlus'
import NormalForm from '@/components/NormalForm'

export default {
  name: 'carbonEmissionAccount',
  components: {
    NormalTable,
    NormalFormPlus,
    NormalForm
  },
  mounted() {
    // 如果有模型id，说明是从选择模型页面返回的，用于新建模型
    if (this.$route.query.modelId) {
      this.addFormModel.modelId = this.$route.query.modelId
      this.showWindow = true
    }

    if (this.$route.query.set) {
      this.tableData = this.$MOCK.enterprise.carbonEmissionAccountList2.data.list
      this.$message({
        message: '保存成功',
        type: 'success'
      });
    } else {
      this.getAccountingByPage();
    }
  },
  data() {
    return {
      addConfig: [
        {
          id: '1',
          type: 'input',
          model: 'name',
          name: '核算名称',
          edit: true,
          props: {
            placeholder: '核算名称',
          }
        },
        {
          id: '2',
          type: 'select',
          model: 'cycleType',
          name: '核算周期类型',
          edit: true,
          props: {
            placeholder: '核算周期类型',
            options: [
              {value: '1', label: '按年'},
              {value: '2', label: '按季度'},
              {value: '3', label: '按月'}
            ]
          },
        },
        {
          id: '3',
          type: 'input',
          model: 'cycle',
          name: '核算周期',
          edit: true,
          props: {
            placeholder: '核算周期',

          }
        },
        {
          id: '4',
          type: 'input',
          model: 'year',
          name: '核算年份',
          edit: true,
          props: {
            placeholder: '核算年份',
          }
        },
      ],
      addFormModel: {
        cycle: "",//	核算周期
        cycleType: "",//		核算周期类型
        lastAccount: 0,//	同比核算
        modelId: "",//		模型id
        name: "",//		核算名称
        year: "",//		核算年份
      },
      plus: {},
      showWindow: false,
      formModel: {
        cycleType: "",
        name: ""
      },
      config: [
        {
          id: 1,
          items: [
            {
              id: '1',
              edit: true,
              type: 'input',
              span: 6,
              model: 'name',
              name: '',
              props: {
                placeholder: "报告名称",

              }
            },
            {
              id: '2',
              edit: true,
              type: 'select',
              span: 6,
              model: 'cycleType',
              name: '',
              props: {
                placeholder: "核算周期",
                options: [
                  {value: '1', label: '按年'},
                  {value: '2', label: '按季度'},
                  {value: '3', label: '按月'}
                ]
              }
            }
          ]
        },
      ],
      plus: {},
      tableData: [],
      paginationConfig: {
        total: 100,
        page: 1,
        pageSize: 10,
        show: true
      },
      operationList: [
        {
          name: '排放源管理',
          order: 1,
          buttonClass: 'primary',
          plus: {}
        },
        {
          name: '碳仿真',
          order: 2,
          buttonClass: 'primary',
          plus: {}
        },
        {
          name: '碳减排顾问',
          order: 3,
          buttonClass: 'primary',
          plus: {}
        },
        {
          name: '删除',
          order: 4,
          buttonClass: 'danger',
          plus: {}
        }

      ],
      operationConfig: {select: false, width: 400},
      tableLabel: [
        {
          prop: "order",
          label: "序号",
          width: 70
        },
        {
          prop: "name",
          label: "核算名称",
          width: 200
        },
        {
          prop: "cycleType",
          label: "核算周期",
          codeTable: {
            1: '按年',
            2: '按季度',
            3: '按月'
          }
        },
        {
          prop: "year",
          label: "核算年份",

        },
        {
          prop: "total",
          label: "排放总量（tCO2）",
          width: 200
        },
        {
          prop: "updater",
          label: "更新人"
        },
        {
          prop: "@updateTime",
          label: "更新时间",
          width: 200
        },
      ],

    }
  },

  methods: {
    // 创建碳排放核算
    createAccount() {
      this.showWindow = false
      if (this.$MOCK.mock) {
        this.$router.push({path: "/enterpriseCarbonAccounting/carbonEmissionManage/SelectEmissionSourceDictionary2"})
        return
      }
      this.$API.enterprise.createAccount({
        ...this.addFormModel
      }).then(response => {
        this.reset()
      })
    },
    // 重置搜索条件
    reset() {
      this.paginationConfig.page = 1;
      this.formModel = {
        cycleType: "",
        name: ""
      }
      this.addFormModel = {
        cycle: "",//	核算周期
        cycleType: "",//		核算周期类型
        lastAccount: 0,//	同比核算
        modelId: "",//		模型id
        name: "",//		核算名称
        year: "",//		核算年份
      }
      this.getAccountingByPage()
    },
    // 获得碳排放核算分页
    getAccountingByPage() {
      if (this.$MOCK.mock) {
        this.tableData = this.$MOCK.enterprise.carbonEmissionAccountList.data.list
        this.paginationConfig.total = this.$MOCK.enterprise.carbonEmissionAccountList.data.total
        return
      }
      this.$API.enterprise.getAccountingByPage({
        ...this.formModel,
        pageNo: this.paginationConfig.page,
        pageSize: this.paginationConfig.pageSize,
      }).then(response => {
        this.tableData = response.data.list
        this.paginationConfig.total = response.data.total
      })
    },
    // 添加核算报告， 先前往模型选择页面
    add() {
      this.$router.push("/enterpriseCarbonAccounting/carbonEmissionManage/newCarbonAccount1")
    },
    // 处理表格点击事件
    handleEvent(order, row) {
      if (order === 1) {
        this.$router.push({
          path: "/enterpriseCarbonAccounting/carbonEmissionManage/SelectEmissionSourceDictionary2",
          query: {id: row.id}
        })
      } else if (order == 2) {
        this.$router.push({path: "/enterpriseCarbonAccounting/enterpriseCarbonAccounting/carbonSimulation"})
      } else if (order == 3) {
        this.$router.push({path: "/enterpriseCarbonAccounting/enterpriseCarbonAccounting/carbonEmissionAside"})
      }
    },
    // 分页点击事件
    changePage() {
      this.getAccountingByPage();
    }
  }
}
</script>

<style lang="less" scoped>
.carbonEmissionAccount {

  height: 680px;
  overflow: hidden;
  padding: 15px 10px;
  // 标题
  .carbonEmissionAccount-title {
    font-size: 16px;
    font-weight: bold;
  }

  .carbonEmissionAccount-condition {
    display: flex;

    .carbonEmissionAccount-condition-form {
      flex: 3;
    }

    .carbonEmissionAccount-condition-btn {
      flex: 1;
    }
  }

  // 核算报告表格
  .carbonEmissionAccount-report {
    .carbonEmissionAccount-history-title {
      font-size: 14px;
    }
  }
}
</style>
